<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="Author" content="CJR" />
    <meta name="Copyright" content="Copyright (c) CJR" />
    <meta name="keywords" content="博客,前端,ife,百度前端技术学院,东夋壬,前端教程,前端学习,前端开发,web,web开发">
    <meta name="description" content="ife百度前端技术学院课程学习笔记,个人学习笔记">
    <title>HTML/CSS 基础</title>
    <link rel="shortcut icon" href="../../favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/normalize.min.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <main class="page-wrap">
        <div class="article">
            <header class="header-card white-underline-links">
                <h2 class="header-card-title">HTML 和 CSS 基础</h2>
                <p class="header-card-reference">
                    参考文档文章<br>
                    <a href="https://www.w3school.com.cn/html/index.asp">W3School 的 HTML 教程</a><br>
                    <a href="https://www.w3school.com.cn/html5/index.asp">W3School 的 HTML5 教程</a><br>
                    <a href="https://developer.mozilla.org/zh-CN/docs/Learn/Getting_started_with_the_web">MDN 的学习 Web 开发
                    </a><br>
                    <a href="https://www.w3cschool.cn/html/">W3School 的 HTML 教程</a><br>
                </p>
            </header>
            <div class="mini-card-grid">
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">常用标签的分类：block、inline</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/1/index.html">read more</a>
                    </div>
                </div>
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">元数据、表格、表单</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/2/index.html">HTML 元数据</a>
                        <a href="./src/2/table.html">HTML 表格</a>
                        <a href="./src/2/form.html">HTML 表单</a>
                    </div>
                </div>
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">选择器、字体、背景、浮动和定位</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/3/index.html">read more</a>
                    </div>
                </div>
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">三种简历</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/4/resume.html">read more</a>
                    </div>
                </div>
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">弹性盒子布局、网格布局和其它常见布局</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/5/index.html">flex 布局</a>
                        <a href="./src/5/grid.html">grid 布局</a>
                        <a href="./src/5/orther.html">其它布局</a>
                    </div>
                </div>
                <div class="mini-card">
                    <header class="mini-article-card-header">
                        <h2><a href="#">简单的静态页面</a></h2>
                    </header>
                    <div class="mini-article-meta">
                        <a href="./src/6/index.html">read more</a>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <footer class="site-footer">
        设计源于<a href="https://css-tricks.com/" class="read-more">CSS-Tricks</a>，返回<a href="../../index.html"
            class="read-more">主页</a>
    </footer>
</body>

</html>